<template>
	<view class="page">
	
		<view class="page-wrap  "  style="margin-top: 600rpx;">
			<view class="code-bg height-760">
				<view class="title">
					做任务领奖励
				</view>
				<view class="re-list">
					<scroll-view scroll-y="true" >
						<view class="list-item flex align-center justify-between" v-for="(item,index) in list" >
							<view class="item flex align-center">
								<image :src="item.image" class="round" mode="" style="width: 86rpx;height: 86rpx;margin-right: 32rpx;min-width: 86rpx;"></image>
								<view class="flex flex-direction " style="width: 320rpx;max-width: 320rpx;">
									<text class="text-333 text-bold text-cut-1">{{item.title}}</text>
									<text style="margin-top: 8rpx;" class="text-999">{{item.desc}}</text>
								</view>
							</view>
							<view class="btnbg" @click="toDetail(item)" v-if="item.is_task!=1">
								{{item.sign=='1'?'去填写':'去浏览'}}
							</view>
							<view class="btnbg1"  v-else>
								已完成
							</view>
						</view>
					</scroll-view>
				
				</view>
			</view>
		
		</view>


	
		<fu-notwork></fu-notwork>
	</view>
</template>
<script>
	import {
		BASE_URL
	} from '@/common/config.js';
	// import fuShareInvite from '../../components/fu-share-invite/fu-share-invite.vue';
	export default {
		// components: {
		// 	fuShareInvite
		// },
		data() {
			return {
				userInfo: {},
				list:[]
			};
		},
	
		onShow() {
			if (global.token) {
				this.getInfo();
				this.getRenwuList()
			}

		},
	
		methods: {
			hadleCopy(content) {
				uni.setClipboardData({
					data: content,
					success: () => {
						this.$message.success(this.i18n['复制成功'])
					}
				});
			},
			// 打开弹窗
			openPopup() {
				this.$refs.share.open();
			},
			// 返回
			back() {
				uni.navigateBack();
			},
		

			// 获取用户信息
			getInfo() {
				this.$api.post(global.apiUrls.postGetUserInfo, {
					user_id: global.userInfo && global.userInfo.id || 0,
				}).then(res => {
					console.log(res);
					res = res.data;
					if (res.code == 1) {
            this.userInfo = res.data
						this.$store.commit('updateUserInfo', res.data);
            
						this.$forceUpdate();
					}
					uni.stopPullDownRefresh();
				})
			},
		getRenwuList() {
			this.$api.post(global.apiUrls.rwList, {
				page:1,
				list_rows:100
			}).then(res => {
				console.log(res);
				res = res.data;
				if (res.code == 1) {
				this.list = res.data.data
				}
			})
		},
		
		toDetail(item){
			if(item.sign!='1'){
				this.$urouter.navigateTo({
				  url: '/pages/goods/goodsdetail/goods-detail/index',
				  params: {
				    sku_id: item.sku_id || 0,
				    goods_id: item.goods_id,
					sign_time:item.sign_time,
					task_id:item.id
				  }
				});
			}else{
				this.$urouter.navigateTo({
				  url: '/pages/activity/diaocha/index',
				  params: {
					task_id:item.id
				  }
				});
			}
			
		}
		

		},

	};
</script>
<style lang="scss" scoped>
	button {
	  background: #FFFFFF;
	
	  &:after {
	    border: none;
	  }
	  .margin-top-xs{
		  margin-top: 0;
		  height: 44rpx;
	  }
	}
	.page {
		width: 100%;
		height: 100vh;
		overflow: hidden;
		background-image: url($IMG_BASE_URL+'/activity/re-bg.png');
		background-repeat: no-repeat;
		background-size: 100% 100%;

		.page-wrap {
			margin-left: 24rpx;
			margin-right: 24rpx;
			.code-bg {
				position: relative;
				background: #FFFFFF;
				border-radius: 24rpx;
				padding: 40rpx 32rpx;
				.scancode {
					position: absolute;
					bottom: 94rpx;
					left: 0;
					right: 0;
					margin: auto;
				}

				.input-code {
					position: absolute;
					right: 0;
					top: 32rpx;
					border-top-left-radius: 28rpx;
					border-bottom-left-radius: 28rpx;
				}
			}

		}

		.opacity-box {
			width: 80%;
			margin: 0 auto;
			left: 10%;
			height: 719rpx;
			background: rgba(255, 255, 255, 0.14);
			border-radius: 24rpx;
			position: fixed;
			z-index: 2;
			bottom: 300rpx;
		}

		.scancode {
			padding: 15rpx;
			width: 300rpx;
			height: 300rpx;
			border-radius: 10rpx;
			background-color: white;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.bottom {
			width: 60%;
			height: 30%;

			.cu-btn {
				&:first-child {
					background: #FFFFFF;
					color: #333333;
				}

				&:last-child {
					background: $theme;
					color: #FFFFFF;
				}
			}

		}

	}
	.title{
		font-size: 36rpx;
		font-family: PingFang SC-Semibold, PingFang SC;
		font-weight: bold;
		color: #000000;
		line-height: 39rpx;
		margin-bottom: 48rpx;
		
	}
	.btnbg{
		width: 138rpx;
		height: 50rpx;
		background: linear-gradient(270deg, #FF3734 0%, #FF8000 100%);
		box-shadow: 1rpx 1rpx 12rpx 1rpx rgba(255,58,52,0.44);
		border-radius: 25rpx 25rpx 25rpx 25rpx;
		opacity: 1;
		text-align: center;
		line-height: 50rpx;
		color: #ffffff;
	}
	.btnbg1{
		width: 138rpx;
		height: 50rpx;
		background: #f8f8f8;
		// box-shadow: 1rpx 1rpx 12rpx 1rpx rgba(255,58,52,0.44);
		border-radius: 25rpx 25rpx 25rpx 25rpx;
		opacity: 1;
		text-align: center;
		line-height: 50rpx;
		color: #333333;
	}
	.list-item{
		margin-bottom: 57rpx;
	}
</style>
